<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Product-<{:C('site_title')}></title>
<meta name="keywords" content="<{:C('site_keyword')}>">
<meta name="description" content="<{:C('site_content')}>">
<link rel="stylesheet" href="<{:STATICS}>/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="<{:STATICS}>/css/bootstrap.min.css">
<link rel="stylesheet" href="<{:RES}>/css/style.css" />

<include file="Public:js" />
<script type="text/javascript" src="<{:RES}>/js/ljsGlasses.js"></script>
<style>
.carList{clear: both; overflow: hidden;}
.carList .hd{ background-color: #f7f7f7; height: 40px; line-height: 40px; cursor: pointer; border-bottom: 1px #dbdbdb solid;}
.carList .hd p{float: left; margin: 0; padding-left: 10px; font-weight: bold;}
.carList .hd span{float: right; margin: 0; padding-right: 10px;}
.carList .bd{padding: 10px; border: 1px #dbdbdb solid; clear: both; overflow: hidden; display: none;}
.carList .bd table{margin-bottom: 0; font-size: 12px}
</style>
</head>
<body>

<include file="Public:header" />

<div class="inBanner"><h1>PRODUCT</h1></div>

<div class="mfbox inBox">
	<div class="leftMenu">
		<?php
		foreach ($proMenu as $key => $val1) {
			echo '<li><a href="">'.$val1['name'].'</a>';
			echo '<ul>';
			foreach ($val1['childrens'] as $key => $val2) {
				if ($val2['childrens']) {
					echo '<li><a href="javascript:void(0)" onclick="show(this)">'.$val2['name'].'</a>';
				}else{
					echo '<li class="fenlei"><a href="'.U('Product/index',array('cateID'=>$val2['id'])).'">'.$val2['name'].'</a>';
				}				
				echo '<ul style="display:none">';
				foreach ($val2['childrens'] as $key => $val3) {
					if($list['id']==$val3['id']){
						echo '<li class="active">';
					}else{
						echo '<li>';
					}
					if ($val3['childrens']) {
						echo '<a href="javascript:void(0)" onclick="show(this)">'.$val3['name'].'</a>';
					}else{
						echo '<a href="'.U('Product/index',array('cateID'=>$val3['id'])).'">'.$val3['name'].'</a>';
					}
					echo '<ul style="display:none">';
					foreach ($val3['childrens'] as $key => $val4) {
						if($list['id']==$val4['id']){
							echo '<li class="active">';
						}else{
							echo '<li>';
						}
						echo '<a href="'.U('Product/index',array('cateID'=>$val4['id'])).'">'.$val4['name'].'</a>';
						echo '</li>';
					}
					echo '</ul>';
					echo '</li>';
				}
				echo '</ul>';
				echo '</li>';
			}
			echo '</ul>';
			echo '</li>';
		}
		?>
	</div>

	<div class="productInfoBox">
		<div style="clear: both; overflow: hidden; margin-bottom: 15px">
				<div class="goodsImage">
					<div id="showbox">
						<volist name="image" id="vo">
						<img src="<{$vo.url}>" width="<{$vo.width}>" height="<{$vo.height}>" />
						</volist>
					</div><!--展示图片盒子-->
					<div id="showsum"></div><!--展示图片里边-->
					<p class="showpage">
				  		<a href="javascript:void(0);" id="showlast"> < </a>
				  		<a href="javascript:void(0);" id="shownext"> > </a>
					</p>
				</div>
				<script type="text/javascript">
				  $(document).ready(function(){
					  var showproduct = {
						  "boxid":"showbox",
						  "sumid":"showsum",
						  "boxw":400,//宽度,该版本中请把宽高填写成一样
						  "boxh":400,//高度,该版本中请把宽高填写成一样
						  "sumw":60,//列表每个宽度,该版本中请把宽高填写成一样
						  "sumh":60,//列表每个高度,该版本中请把宽高填写成一样
						  "sumi":7,//列表间隔
						  "sums":5,//列表显示个数
						  "sumsel":"sel",
						  "sumborder":1,//列表边框，没有边框填写0，边框在css中修改
						  "lastid":"showlast",
						  "nextid":"shownext"
						  };//参数定义	  
					 $.ljsGlasses.pcGlasses(showproduct);//方法调用，务必在加载完后执行
				  });
				</script>
				<div class="goodsBase">
					<h1><{$list.name}></h1>
					<volist name="intr" id="vo">
					<p><{$vo}></p>
					</volist>

					<!-- <div class="share">
						                    <div id="share_box">
							<span class='st_sharethis_large' displayText='ShareThis'></span>
							<span class='st_facebook_large' displayText='Facebook'></span>
							<span class='st_twitter_large' displayText='Tweet'></span>
							<span class='st_linkedin_large' displayText='LinkedIn'></span>
							<span class='st_pinterest_large' displayText='Pinterest'></span>
							<span class='st_email_large' displayText='Email'></span>
					
					
							<script type="text/javascript">var switchTo5x=true;</script>
							<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
							<script type="text/javascript">stLight.options({publisher: "b47395a0-f60c-4bf7-8712-7f4e085b4ed8", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script>
						</div>
						                </div>
					
					
					<h2>Telephone<span><{:C('site_tel')}></span></h2> -->
				</div>
			</div>
			<!-- <div class="panel panel-default">
				<div class="panel-heading">Characteristic</div>
				<div class="panel-body">
				<{$list.texing}>
				</div>
			</div>
			
			<div class="panel panel-default">
				<div class="panel-heading">Product features</div>
				<div class="panel-body">
				<{$list.tedian}>
				</div>
			</div> -->
			
			<div class="panel panel-default">
				<div class="panel-heading">Applicable Models</div>
				<div class="panel-body">
					<volist name="car" id="vo">
					<div class="carList">
						<div class="hd"><p><{$vo.brandName}> <{$vo.carName}></p><span><{$vo.year}></span></div>
						<div class="bd">
							<table class="table table-condensed">
						    	<thead>
						        	<tr>
						          	<th>车型</th>
						          	<th>发动机</th>
						          	<th>底盘</th>
						          	<th>CC</th>
						          	<th>KW</th>
						          	<th>类型</th>
						          	<th>缸数</th>
						          	<th>年款</th>
						        	</tr>
						    	</thead>
						    	<tbody>
						    		<volist name="vo.info" id="f">
						    		<tr>
						    			<td><{$f.name}></td>
						    			<td><{$f.fadongji}></td>
						    			<td><{$f.dipan}></td>
						    			<td><{$f.cc}></td>
						    			<td><{$f.kw}></td>
						    			<td><{$f.type}></td>
						    			<td><{$f.gangshu}></td>
						    			<td><{$f.year}></td>
						    		</tr>
						    		</volist>
						    	</tbody>
    						</table>
						</div>
					</div>
					</volist>
				</div>
			</div>

			<div class="panel panel-default">
				<div class="panel-heading">Product introduction</div>
				<div class="panel-body">
				<{$list['content']|htmlspecialchars_decode=###}>
				</div>
			</div>
		</div>
	</div>
</div>
<script>
$(function(){
	$(".carList .bd:eq(0)").show();
	$(".carList .hd").click(function(){
		var o = $(this).next();
		if(o.is(":hidden")){
			o.show();
		}else{
			o.hide();
		}
	});
})
function show(obj){
	alert('22');
	var $ul = $(obj).next("ul");
	if($ul.is(':visible')){
		$ul.stop().slideUp();
	}else{
		$ul.stop().slideDown();
	}
}
$(function(){
	li = $(".leftMenu li.active");
	li.parent("ul").show();
	li.parent().parent().parent("ul").show();
})
</script>


<include file="Public:footer" />
</div>      
</body>
</html>